#div1{
	width:1200px;
	height:1600px;
	border:1px solid red;
}


#div2{
	position:relative;
	width:120px;
	height:140px;
	border:1px solid red;
	margin:10px;
	overflow:hidden;
}
 #div2 #div3{
	position:absolute;
	width:450px;
	float:left;
}
 #div2 #div3 img{
	float:left;
}
#u1{
	position:absolute;
	float:left;
	top:10px;
	left:160px;
	list-style:none;
	background-color:gray;

}
#u1 li{
	display:inline-block;
	width:100px;
	text-align:center;
}
#u1 li:hover{
	color:red;
	cursor:pointer;
	background-color:white;
}
#div4 table{
	position:absolute;
	top:50px;
	left:170px;
	border:1px solid gray;
	padding:3px;
	display:none;
	cursor:pointer;
	z-index:6;
}
#div4 table td{
	border:1px solid gray;
	padding:3px;
}
#div4 table td:hover{
	color:red;
	background-color:yellow;
}
#div5{
	position:absolute;
	top:-50px;
	left:180px;
	background:white;
	width:300px;
	height:200px;
	color:#2289f0;
	padding:15px;
	margin:100px auto;
	text-align:center;
	box-shadow:10px 10px 15px 10px black;
	display:none;
	z-index:6;
}
#div5 hr{
	width:80%;
	border:1px solid #2289f0;
	margin-bottom:15px;
}
#div5 input{
	width:180px;
	height:20px;
	margin:5px;
	font-size:16px;
}
#div6{
	position:absolute;
	top:-50px;
	left:280px;
	background:white;
	width:300px;
	height:310px;
	color:#2289f0;
	padding:15px;
	margin:100px auto;
	text-align:center;
	box-shadow:10px 10px 15px 10px black;
	display:none;
	z-index:6;
}
#div6 hr{
	width:80%;
	border:1px solid #2289f0;
	margin-bottom:15px;
}
#div6 input{
	width:180px;
	height:20px;
	margin:5px;
	font-size:16px;
}
#div6 span{
	border:1px solid black;
	color:white;
	background-color:blue;
	cursor:pointer;
}

 #input2{
	position:absolute;
	top:100px;
	left:200px;
	width:390px;
	height:30px;
	border:1px solid red;
}
 #p1{
	position:absolute;
	top:75px;
	left:590px;
	color:blue;
	background-color:red;
	font-size:25px;
	cursor:pointer;
}
#div7{
	position:absolute;
	top:135px;
	left:200px;
	width:50px;
	height:20px;
	-border:1px solid red;

}
#div7 marquee{
	color:red;
}
#u2{
	list-style:none;
	position:absolute;
	top:120px;
	left:250px;
}
#u2 li{
	cursor:pointer;
	display:inline-block;
	font-size:10px;
	color:red;
}
#div8{
	position:absolute;
	top:120px;
	left:700px;
}
#div8 p{
	font-size:20px;
	float:left;
	color:red;
}
#div8 input{
	width:40px;
	float:right;
}
#img1{
	position:absolute;
	top:-50px;
	right:-200px;
}
#div9{
	position:absolute;
	top:150px;
	left:200px;
}
#div9 #u3{
	color:gray;
	list-style:none;
}
#div9 #u3 li{
	display:inline-block;
	font-size:17px;
}
#div9 #u3 li:hover{
	color:red;
	cursor:pointer;
}
#div9 img{
	position:absolute;
	top:-10px;
	right:-340px;
	width:300px;
	border-radius:20px;
}
#section{
	position:relative;
	margin-top:40px;
	width:1200px;
	height:510px;
	border:1px solid red;
}
.left{
	position:absolute;
	float:left;
}
.left ul{
	list-style:none;
}
.left ul li{
	line-height: 35px;
}
.left ul li a:hover{
	color:red;
	text-decoration:none;
}
.main{
	position:relative;
	left:200px;
	width:592px;
	height:500px;
	border:1px solid red;
	float:left;
	overflow:hidden;
}
.main ul{
	position:absolute;
	top:460px;
	left:160px;
	z-index:20;
	list-style:none;
}
.main ul li{
	display:inline-block;
	width:25px;
	height:25px;
	border:1px solid gray;
	text-align:center;
	cursor:pointer;
	border-radius:50%;
}
#d1{
	position:absolute;
	width:3500px;
}
#d1 img{
	float:left;
}
.right{
	position:absolute;
	left:800px;
	width:200px;
}
.right1{
	position:absolute;
	left:1050px;
}
.right1 .span1{
	width:20px;
	height:20px;
	border-radius:5px;
	cursor:pointer;
}
.right1 .span1:hover{
	background-color:red;

}
.right2{
	position:absolute;
	left:1000px;
	top:190px;
	width:200px;
	height:310px;
	border:2px solid red;
	overflow:hidden;
}
#d2 #d2-1{
	position:relative;
	width:200px;
	height:280px;
	margin-left:10px;
	background-image:repeating-linear-gradient(90deg,#e50743,#e8ed30,#efcc,#3fa6ee);
}
#d2 #d2-1 #p1{
	position:absolute;
	top:40px;
	left:40px;
	font-size:30px;
}
#d2 #d2-1 #p2{
	position:absolute;
	top:80px;
	left:40px;
	font-size:20px;
}
#d2 #d2-1 #p3{
	position:absolute;
	top:130px;
	left:20px;
	font-size:20px
}
#d2 #d2-1 #shi1{
	position:absolute;
	width:52px;
	height:40px;
	top:200px;
	left:10px;
	font-size:20px;
	border:1px solid red;
	text-align:center;
}
#d2 #d2-1 #shi2{
	position:absolute;
	width:52px;
	height:40px;
	top:200px;
	left:80px;
	border:1px solid red;
	font-size:20px;
	text-align:center;
}
#d2 #d2-1 #shi3{
	position:absolute;
	width:50px;
	height:40px;
	top:200px;
	border:1px solid red;
	left:150px;
	font-size:20px;
	text-align:center;
}
#zhanshi{
	position:absolute;
	top:730px;
	left:230px;
}
#zhanshi a{
	float:left;
	margin-left:10px;
}
#warp{
	width:300px;
	height:310px;
	border:2px solid red;
	margin-top:10px;
	background-color:black;
	perspective:1000px;
}
#warp #sence{
	position:absolute;
	left:0px;
	top:0px;
	width:200px;
	height:320px;
	margin:150px auto;
	transform-style:preserve-3d;
	background:red;
}
#warp #sence ul{
	position:absolute;
	list-style:none;
}
#warp #sence ul li{
	position:absolute;
	border-radius:10px;
	box-shadow:0 0 10px red;
}
#sence ul li img{
	vertical-align: middle;
	transform: rotateX(-15deg) rotateY(0deg);

	-webkit-box-reflect:below 10px -webkit-linear-gradient(top,rgba(0,0,0,0) 20%,rgba(0,0,0,0.8) 100%);
}
#sence #bg{
	height:500px;
	width:500px;
	background:radial-gradient(circle,at 50% 50%,
		  rgba(244,23,234,0.3),rgba(0,0,0 0));
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-250px;
	margin-top:-250px;
	transform:rotateX(90deg);
	border-radius:50%;
}
#box{
	position:relative;
	top:-450px;
	left:450px;
    width:300px;
	height:300px;
	margin:200px auto;
	perspective: 1000px;
	}
			#box ul{
				position:relative;
				margin:20px 50px;
				list-style:none;
				transform-origin:50% 50% -150px;
				transform-style:preserve-3d;
				transition:4s;
				
			}
			#box ul:hover{
				transform:rotateY(360deg);
			}
			#box ul li{
				position:absolute;
				width:200px;
				height:200px;
				border:2px solid green;
			}
			#box ul li:nth-child(1){
				transform-origin:bottom;
				transform:rotateX(90deg);
				top:-202px;
			}
			#box ul li:nth-child(2){
				transform-origin:top;
				transform:rotateX(-90deg);
				top:202px;
			}
			#box ul li:nth-child(3){
				transform-origin:right;
				transform:rotateY(-90deg);
				left:-202px;
			}
			#box ul li:nth-child(4){
				transform-origin:left;
				transform:rotateY(90deg);
				left:202px;
			}
			#box ul li:nth-child(5){
				transform:translateZ(2px);
			}
			#box ul li:nth-child(6){
				transform:translateZ(-202px);
			}

